<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>标题</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<form id="myForm" enctype="multipart/form-data">
  <label>
    用户名：
    <input type="text" name="username">
  </label><br>
  头像：<input type="file" name="photo"><br>
  <input type="button" value="上传" onclick="uploadFormData();">
</form>
<script>
  function uploadFormData(){
    var form = document.getElementById('myForm');
    var formData = new FormData(form);
    console.log(formData);
    $.ajax({
      type: "POST",
      url: "http://localhost:8080/chat/Upload",
      data: formData,
      processData: false, // Prevents jQuery from automatically transforming the data into a query string
      contentType: false, // Prevents jQuery from setting the content type header
      success: function(response) {
        // Handle the success response from the server here
        console.log("Form data successfully submitted:", response);
      },
      error: function(xhr, status, error) {
        // Handle errors here
        console.error("Error submitting form data:", error);
      }
    });
  }
</script>
</body>
</html>
